<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="utf-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
  <meta name="description" content="" />
  <meta name="author" content="" />

  <title>Store - Your Best Marketplace</title>

  <link href="https://unpkg.com/aos@2.3.1/dist/aos.css" rel="stylesheet" />
  <link href="style/main.css" rel="stylesheet" />
</head>

<body>
  <!-- Navigation -->
  <nav class="navbar navbar-expand-lg navbar-light navbar-store fixed-top navbar-fixed-top" data-aos="fade-down">
    <div class="container">
      <a class="navbar-brand" href="/">
        <img src="images/logo.svg" alt="" />
      </a>
      <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarResponsive"
        aria-controls="navbarResponsive" aria-expanded="false" aria-label="Toggle navigation">
        <span class="navbar-toggler-icon"></span>
      </button>
      <div class="collapse navbar-collapse" id="navbarResponsive">
        <ul class="navbar-nav ml-auto">
          <li class="nav-item active">
            <a class="nav-link" href="index.html">Home </a>
          </li>
          <li class="nav-item">
            <a class="nav-link" href="categories.html">Categories</a>
          </li>
          <li class="nav-item">
            <a class="nav-link" href="#">Rewards</a>
          </li>
        </ul>
      </div>
    </div>
  </nav>

  <!-- Page Content -->
  <div class="page-content page-auth mt-5" id="register">
    <div class="section-store-auth" data-aos="fade-up">
      <div class="container">
        <div class="row justify-content-center">
          <div class="col-lg-4">
            <h2>
              Memulai untuk jual beli <br />
              dengan cara terbaru
            </h2>
            <form class="mt-3">
              <div class="form-group">
                <label>Full Name</label>
                <input type="text" class="form-control is-valid" aria-describedby="nameHelp" v-model="name" autofocus />
              </div>
              <div class="form-group">
                <label>Email</label>
                <input type="email" class="form-control is-invalid" aria-describedby="emailHelp" v-model="email" />
              </div>
              <div class="form-group">
                <label>Password</label>
                <input type="password" class="form-control" />
              </div>
              <div class="form-group">
                <label>Store</label>
                <p class="text-muted">
                  Apakah anda juga ingin membuka toko?
                </p>
                <div class="custom-control custom-radio custom-control-inline">
                  <input class="custom-control-input" type="radio" name="is_store_open" id="openStoreTrue"
                    v-model="is_store_open" :value="true" />
                  <label class="custom-control-label" for="openStoreTrue">Iya, boleh</label>
                </div>
                <div class="custom-control custom-radio custom-control-inline">
                  <input class="custom-control-input" type="radio" name="is_store_open" id="openStoreFalse"
                    v-model="is_store_open" :value="false" />
                  <label makasih class="custom-control-label" for="openStoreFalse">Enggak, makasih</label>
                </div>
              </div>
              <div class="form-group" v-if="is_store_open">
                <label>Nama Toko</label>
                <input type="text" class="form-control" aria-describedby="storeHelp" />
              </div>
              <div class="form-group" v-if="is_store_open">
                <label>Kategori</label>
                <select name="category" class="form-control">
                  <option value="" disabled>Select Category</option>
                </select>
              </div>
              <button type="submit" class="btn btn-success btn-block mt-4">
                Sign Up Now
              </button>
              <button type="submit" class="btn btn-signup btn-block mt-2">
                Back to Sign In
              </button>
            </form>
          </div>
        </div>
      </div>
    </div>
  </div>

  <footer>
    <div class="container">
      <div class="row">
        <div class="col-12 text-center">
          <p class="pt-4 pb-2">
            2020 Copyright Store. All Rights Reserved.
          </p>
        </div>
      </div>
    </div>
  </footer>

  <!-- Bootstrap core JavaScript -->
  <script src="vendor/jquery/jquery.slim.min.js"></script>
  <script src="vendor/bootstrap/js/bootstrap.bundle.min.js"></script>
  <script src="https://unpkg.com/aos@2.3.1/dist/aos.js"></script>
  <script>
    AOS.init();
  </script>
  <script src="vendor/vue/vue.js"></script>
  <script src="https://unpkg.com/vue-toasted"></script>
  <script>
    Vue.use(Toasted);

    var register = new Vue({
      el: "#register",
      mounted() {
        AOS.init();
        this.$toasted.error(
          "Maaf, tampaknya email sudah terdaftar pada sistem kami.",
          {
            position: "top-center",
            className: "rounded",
            duration: 1000,
          }
        );
      },
      data: {
        name: "Angga Hazza Sett",
        email: "kamujagoan@bwa.id",
        password: "",
        is_store_open: true,
        store_name: "",
      },
    });
  </script>
  <script src="script/navbar-scroll.js"></script>
</body>

</html>